const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin')
const { merge } = require('webpack-merge')

const common = require('./webpack.common')

module.exports = merge(common, {
  mode: 'development',

  output: {
    filename: 'scripts/[name].js',
    chunkFilename: 'scripts/[name].chunk.js',
    clean: true
  },

  plugins: [
    new ReactRefreshWebpackPlugin()
  ],

  devServer: {
    host: 'localhost',
    port: 8080,
    open: true,
    hot: true,
    // 使用 index.html 代替所有404页面，解决使用H5的history API刷新页面导致404的问题
    historyApiFallback: true
  }

})
